<template>
    <div>
      <MusicListView title="热歌推荐" v-if="newData.length>0" :newData='newData'/>
      <MusicListView title="新歌推荐" v-if="hotData.length>0" :newData='hotData'/>
      <MusicListView title="摇滚榜" v-if="rockData.length>0" :newData='rockData'/>
    </div>
</template>

<script>
  import MusicListView from "./MusicListView";
  import api from "../../api/base";
    export default {
        name: "MusicList",
      data(){
        return{
          newData:[],
          hotData:[],
          rockData:[]
        }
      },
      components:{
        MusicListView
      },
      mounted(){
        api.getMusicList({
          method:'baidu.ting.billboard.billList',
          type:2,
          size:6,
          offset:0
        })
        .then(data=>{
          this.newData = data.data.song_list;
          // console.log(this.newData)
        });

        api.getMusicList({
          method:'baidu.ting.billboard.billList',
          type:1,
          size:6,
          offset:0
        })
        .then(data=>{
          this.hotData = data.data.song_list;
          // console.log(this.newData)
        });

        api.getMusicList({
          method:'baidu.ting.billboard.billList',
          type:11,
          size:3,
          offset:0
        })
        .then(data=>{
          this.rockData = data.data.song_list;
          // console.log(this.newData)
        });



      }
    }
</script>

<style scoped>

</style>
